<template>
  <div class="error">
    <n-result 
      status="404"
      title="404 资源不存在"
      description="加里奥咯咯"
    >
      <template #footer>
        <n-button @click="handleError">回到首页</n-button>
      </template>
    </n-result>
  </div>

</template>


<script setup lang="ts">
import type { NuxtError } from '#app'
import { NResult, NButton} from 'naive-ui'

  const props = defineProps({
    error: Object as () => NuxtError
  })

  const handleError = () => clearError({ redirect: '/' })

</script>



<style scoped>
.error {
  margin-top: 20%;
}
</style>